<template>
	<body-wrap isFlex>
		<template #header>
			<view class="pbTopBox">
				<view class="icon" @click="date_add(-1)"><i class="iconfont icon-xiangzuojiantou"></i></view>
				<view class="time" @click="openDate">{{curDate}} {{getWeekday(curDate)}}</view>
				<view class="icon" @click="date_add(1)"><i class="iconfont icon-xiangyoujiantou"></i></view>
			</view>
		</template>
		<consult-time-table :lists="lists || []"/>
		<empty v-if="lists && lists.length==0"/>
		<template #footer>
			<div class="ftBtnBox">
				<navigator class="myBtn" url="/pages/home/consult/add">发布</navigator>
			</div>
		</template>
		<uni-datetime-picker ref="dtpRef" class="mydpdate" type="date" :clear-icon="false" v-model="curDate" @change="setDate">
			<template #default>
				<view></view>
			</template>
		</uni-datetime-picker>
	</body-wrap>
</template>

<script>
	import {defineComponent,reactive,toRefs,onMounted,getCurrentInstance,computed} from 'vue'
	import {onLoad,onShow} from '@dcloudio/uni-app'
	import { useStore } from 'vuex'
	import bodyWrap from "@/components/bodyWrap/index.vue"
	import consultTimeTable from "@/components/consultTimeTable/index.vue"
	import {getConsultList} from "@/api/consult.js"
	import {toast,dateFormat,getWeekday,dateAdd} from "@/utils/common.js"
	import empty from "@/components/empty/index.vue"
	export default defineComponent({
		components:{
			bodyWrap,
			consultTimeTable,
			empty
		},
		props:{
		
		},
		setup(props,context) {
			const store = useStore()
			const {proxy} = getCurrentInstance()
			
			const state = reactive({
				userInfo:computed(()=>store.state.base.userInfo),
				curDate:dateFormat('Y-m-d',new Date()),
				pageIndex:1,
				pageSize:20,
				lists:''
			})
			
			onMounted(()=>{
				get_consult_list()
			})
			
			const get_consult_list = async ()=>{
				const res = await getConsultList({
					pageIndex:state.pageIndex,
					pageSize:state.pageSize,
					teacherId:state.userInfo._id,
					searchDate:state.curDate + ' 00:00:00'
				})
				if(res.code == 200){
					state.lists = res.data.data
				}
			}
			
			const openDate = ()=>{
				proxy.$refs.dtpRef.show()
			}
			
			const setDate = ()=>{
				console.log("curDate:",state.curDate)
				get_consult_list()
			}
			const date_add = (num)=>{
				const cDate = dateAdd(num,state.curDate)
				state.curDate = dateFormat('Y-m-d',cDate)
				get_consult_list()
			}
			
			return {
				...toRefs(state),
				openDate,
				setDate,
				getWeekday,
				date_add
			}
		}
	})
</script>

<style lang="scss" scoped>
	.pbTopBox{
		display: flex;
		height: 80rpx;
		align-items: center;
		padding: 0;
		background-color: #fff;
		border-bottom:1px solid #eee ;
		.icon{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100rpx;
			height: 100%;
			flex-shrink: 0;
		}
		.time{
			display: flex;
			height: 100%;
			justify-content: center;
			align-items: center;
			flex: 1;
			flex-shrink: 0;
		}
	}
	.ftBtnBox{
		padding: 20rpx;
		background: #fff;
	}
</style>
